<!DOCTYPE html>
<html>
<head>
    <title>督察模板表</title>
    <#include "/header.html">
        <link rel="stylesheet" href="${request.contextPath}/statics/css/templet.css">
        <link rel="stylesheet" href="${request.contextPath}/statics/css/index.css">
        </head>
<body>
<div id="rrapp">
    <div class="table-box" v-cloak v-if="showList">
        <div class="top-form-box clearfix">
            <el-button round size="small" @click="checkMblb(null)" :type="onAll">全部模板</el-button>
            <el-button round size="small" @click="checkMblb(0)" :type="onDefault">标准模板</el-button>
            <el-button round size="small" @click="checkMblb(1)" :type="onDiy">自定义模板</el-button>
            <el-button round size="small" @click="checkMblb(3)" :type="onDaily">每日必查</el-button>
            <div class="input-box pull-right clearfix">
                <el-input class="pull-left" placeholder="请输入内容" v-model="q.mbmc" @keyup.enter="query" clearable size="small" style="width: 200px;margin-right: 10px"> </el-input>
                <el-button class="pull-left" type="primary" round size="small" @click="query">查询</el-button>
                <div class="tpl-type-add pull-left">
                    <span class="add-tpl" @click.stop="addTpl"><i class="fa fa-plus"></i></span>
                </div>
            </div>
        </div>

        <el-table :data="tableData" border>
            <el-table-column
                type="index"
                :index="indexMethod"
                width="50">
            </el-table-column>
            <el-table-column prop="mbmc" label="模板标题">
            </el-table-column>
            <el-table-column prop="shijdm" label="创建单位" :formatter="formatCorp">
            </el-table-column>
            <el-table-column prop="cityName" label="生效区域">
            </el-table-column>
            <el-table-column prop="createTime" label="创建时间" :formatter="formatTime">
            </el-table-column>
            <el-table-column prop="standardType" label="模板类型" :formatter="formatStandardType">
            </el-table-column>
            <el-table-column prop="status" label="模板使用状态"  :formatter="formatStatus">
                <!--{{scope.row.status | formatStatus}}-->
            </el-table-column>
            <el-table-column label="操作">
                <template slot-scope="scope">
                    <el-button size="mini" @click="handleView(scope.$index, scope.row)">查看</el-button>
                </template>
            </el-table-column>
        </el-table>
        <div class="pagination-box pull-right">
            <el-pagination background layout="prev, pager, next" :page-size="pageSize" :current-page.sync="pageNo" :page-count="totalPage" @current-change="pageChange"></el-pagination>
        </div>
    </div>



    <div class="form-box" v-cloak v-if="!showList">
        <!--查看-->
        <div class="view-box" v-if="viewList">
            <h3 class="content-title clearfix">模板详情
                <i class="el-icon-back pull-right" @click.stop="cancel"></i>
            </h3>
            <div class="detail-box clearfix">
                <div class="tpl-info pull-left clearfix">
                    <span class="tpl-icon pull-left"><img src=""></span>
                    <p class="tpl-infos pull-left">
                        <span class="tpl-title">{{lookTitle}}</span>
                        <span class="tpl-arg">
                            <span>{{lookTime}}</span>
                            <span>{{lookCorp}}</span>
                            <span class="status" :class="{'active': lookStatus === '使用中'}">{{lookStatus}}</span>
                        </span>
                    </p>
                </div>
                <div class="tpl-status-btn pull-right">
                    <el-button v-if="lookCheck" type="success" size="small" icon="el-icon-circle-check-outline" @click="updateStatus">启用</el-button>
                    <el-button v-if="lookCheck" type="danger" size="small" icon="el-icon-delete"　@click="deleteTemplet">删除</el-button>
                    <el-button v-if="lookUpdateCheck" type="primary" size="small" icon="el-icon-edit-outline" @click="editTpl">修改</el-button>
                </div>
            </div>
            <div class="view-content">
                <h3 class="flex-view-title">
                    {{viewTitle}}
                </h3>
                <div class="flex-box-content">
                    <div class="list-padding-box">
                        <el-tree
                            :data="viewData"
                            :props="props"
                            node-key="id"
                            ref="viewTree"
                            empty-text="暂无选中模板"
                            :default-expanded-keys="viewExpandedKeys"
                        >
                        </el-tree>
                    </div>
                </div>
            </div>
        </div>
        <!--新增-->
        <div class="edit-box" v-cloak v-if="editList">
            <h3 class="content-title clearfix">{{addTitle}}
                <i class="el-icon-back pull-right" @click.stop="cancel('edit')" v-if="isEdit"></i>
                <i class="el-icon-back pull-right" @click.stop="cancel('add')" v-if="isAdd"></i>
            </h3>
            <div class="flex-right clearfix">
                <div class="tpl-add-name clearfix">
                    <span class="title pull-left">标题：</span>
                    <el-input class="pull-left" placeholder="请输入标题" v-model="addTplTitle" clearable size="medium" style="width: 400px"></el-input>
                    <el-select v-model="mblx" placeholder="请选择" @change="changeMblx" size="medium" style="width: 200px;margin-left: 15px">
                        <el-option v-for="item in mblxList" :key="item.value" :label="item.label" :value="item.value"> </el-option>
                    </el-select>
                </div>
                <h4 class="flex-box-title">
                    {{rightTtitle}}
                </h4>
                <div class="flex-right-left">
                    <div class="flex-box-content">
                        <div class="list-padding-box">
                            <h4 class="tpl-view-title">{{addTplTitle}}</h4>
                            <el-tree
                                :data="checkedData"
                                :props="props"
                                node-key="id"
                                ref="checkedTree"
                                empty-text="暂无选中问题项"
                                :default-expanded-keys="checkedExpandedKeys"
                            >
                            </el-tree>
                        </div>
                    </div>
                </div>
                <div class="flex-right-right" >
                    <div class="flex-box-content">
                        <div class="list-padding-box">
                            <h4 class="tpl-view-title">选择问题项</h4>
                            <el-tree
                                :data="problemData"
                                :props="props"
                                show-checkbox
                                node-key="id"
                                @check="handleCheckChange"
                                ref="problemTree"
                                empty-text="暂无问题项"
                                :default-expanded-keys="problemExpandedKeys"
                                :default-checked-keys="problemCheckedKeys"
                            >
                            </el-tree>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="bottom-btn-box" v-if="editList">
            <el-button plain size="medium" @click.stop="cancel('add')" v-if="isAdd">取消</el-button>
            <el-button plain size="medium" @click.stop="cancel('edit')" v-if="isEdit">取消</el-button>
            <el-button type="primary" size="medium"  @click.stop="comfirmAddTpl" v-if="isAdd">确定</el-button>
            <el-button type="primary" size="medium"  @click.stop="comfirmUpdateTpl" v-if="isEdit">修改</el-button>
        </div>
    </div>
</div>

<script src="${request.contextPath}/statics/plugins/element/index.js"></script>
<script src="${request.contextPath}/statics/js/modules/business/supervisetempletTest.js?_${.now?long}"></script>
</body>
</html>